<template>
 <div class="pages-container">
   <header >
    <router-view name="header"/>

   </header>
   <main>
    <router-view/>
   </main>
   <footer >
    <router-view name="footer"/>

   </footer>

 </div>
</template>
<script>
export default {
  name: 'index',
  data () {
    return {

    }
  }
}
</script>
<style lang="less" scoped>
@import '@/style/common.less';
.pages-container{

    display: flex;
    flex-direction: column;
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:90;
background-color: @c1;
}
main{
  flex:1;
 overflow:auto;

}
</style>
